<template>
  <div id="panel">
     <div class="title-box bg-color flex-between-center">
        <div class="title title-color">{{panelTitle}}</div>
        <i class="iconfont icon-shuaxin1"></i>
     </div>
     <div class="panel-body flex">
        <slot></slot>
     </div>
  </div>
</template>

<script>
   export default({
    name:'Panel',
    props:{
        panelTitle:String,
    },
    data(){
        return {
        }
    },
   })
</script>

<style scoped lang="less" >
#panel{

    .title-box{
        border-radius: 0.04rem;
        margin-bottom: 0.05rem;
        padding: 0.1rem;
        height: 30px;
       i{
        color: #84a4ee;
        font-weight: 700 !important;
       }
    }

    .panel-body{
    //   background-color: black;
         &>div{
            border-radius: 0.04rem;
         }
    }
}
</style>